<template>
    <div v-swiper:mySwiper="swiperOption">
      <div class="swiper-wrapper">
        <div class="swiper-slide" v-for="item in banners" :key="item.name">
          <img :src="item.src" />
        </div>
      </div>
      <div class="swiper-pagination swiper-pagination-bullets"></div>
    </div>
</template>

<script>
export default {
  data() {
    return {
      swiperOption: {
        autoplay: 5000,
        initialSlide: 1,
        loop: true,
        pagination: '.swiper-pagination',
        onSlideChangeEnd: swiper => {
          // console.log('onSlideChangeEnd', swiper.realIndex)
        }
      }
    }
  },
  props:{
    banners:{
      type:Array,
      default(){
        return [
          {
          name:'权力的游戏',
          src:"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1505449953362&di=2a9376cb0e9a8176091264156d749b75&imgtype=0&src=http%3A%2F%2Fimg2.3lian.com%2F2014%2Ff3%2F72%2Fd%2F85.jpg"
        },
        {
          name:'火焰烈龙',
          src:"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1505450582535&di=dfd1c0f9ed3c370ba337f41085c0c9ae&imgtype=0&src=http%3A%2F%2Fimg.youxiguancha.com%2Fgame%2F2015%2F03%2F19%2F1426742096_2.jpg"
        },{
          name:"最后的神剑",
          src:"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1505450708067&di=65ace94054b1da9b4008be5ebfa1f62e&imgtype=0&src=http%3A%2F%2Fi1.img.969g.com%2Fnews%2Fimgx2013%2F11%2F25%2F196_094148_fca83_lit.jpg"
        }
        ]
      }
    }
  },
  created(){
  }
}
</script>

<style scoped lang="less">
.banner {
  height: 260px;
}
.swiper-container{
  height: 260px;
  img{
    height: 260px;
    width: 100%;
  }
}
</style>
